const path = require('path')


module.exports = {
  // 入口：字符类型
  entry: './src/main.js',
  // 出口: 对象类型
  output: {
    // path: "需要动态获取路径",
    // resolve() 路径拼接
    // __dirname: 获取当前文件所在路径(绝对路径)
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js',
    // 如果有涉及到url的东西都会加上下面这个前缀
    publicPath: 'dist/'
  },
  module: {
    rules: [
      {
        // 正则表达式，匹配所有.css后缀文件
        test: /\.css$/,
        // css-loader: 负责将css文件进行加载
        // style-loader: 负责将样式添加到Dom中
        use: [ 'style-loader', 'css-loader', 'less-loader' ]
      },
      {
        test: /\.less$/,
        use: [{
          loader: "style-loader" // creates style nodes from JS strings
        }, {
            loader: "css-loader" // translates CSS into CommonJS
        }, {
            loader: "less-loader" // compiles Less to CSS
        }]
      },
      {
        test: /\.(png|jpg|gif|jpeg)$/,
        use: [
          {
            loader: 'url-loader',
            options: {
              // 当加载图片小于limit时，会将图片编程成base64字符串形式
              // 如果加载图片大于limit时，需要使用file-loader加载
              // 图片像素 843kb = 843*1024=863232
              limit: 8190,
              // limit: 900000
              // 对图片进行命名 [name] 当成变量进行获取 / 文件夹
              name: 'img/[name].[hash:8].[ext]'
            },
            
          }
        
        ]
      },
      {
        test: /\.js$/,
        // exclude: 排除
        // include: 包含
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            // 
            presets: ['es2015']
          }
        }
      }
    ]
  }
}